<script setup></script>

<template>
  <!-- 上方介绍卡片 -->
  <a-card
    style="width: 400px; margin: 2em auto 5em; font-size: 1.2em"
    hoverable
  >
    <!-- 项目详细文档 -->
    <div class="docs" style="text-align: center; margin-bottom: 1em">
      <a
        href="https://docs.bugdesigner.cn/docs/tools/iTime_docs.html"
        target="_blank"
        rel="noopener noreferrer"
        >📄 软件使用说明书</a
      >
    </div>
    <!-- 群组 -->
    <div
      class="group"
      style="display: flex; align-items: center; justify-content: center"
    >
      <svg
        t="1703247674103"
        class="icon"
        viewBox="0 0 1024 1024"
        version="1.1"
        xmlns="http://www.w3.org/2000/svg"
        p-id="5001"
        width="1.2em"
        height="1.2em"
      >
        <path
          d="M511.09761 957.257c-80.159 0-153.737-25.019-201.11-62.386-24.057 6.702-54.831 17.489-74.252 30.864-16.617 11.439-14.546 23.106-11.55 27.816 13.15 20.689 225.583 13.211 286.912 6.767v-3.061z"
          fill="#FAAD08"
          p-id="5002"
        ></path>
        <path
          d="M496.65061 957.257c80.157 0 153.737-25.019 201.11-62.386 24.057 6.702 54.83 17.489 74.253 30.864 16.616 11.439 14.543 23.106 11.55 27.816-13.15 20.689-225.584 13.211-286.914 6.767v-3.061z"
          fill="#FAAD08"
          p-id="5003"
        ></path>
        <path
          d="M497.12861 474.524c131.934-0.876 237.669-25.783 273.497-35.34 8.541-2.28 13.11-6.364 13.11-6.364 0.03-1.172 0.542-20.952 0.542-31.155C784.27761 229.833 701.12561 57.173 496.64061 57.162 292.15661 57.173 209.00061 229.832 209.00061 401.665c0 10.203 0.516 29.983 0.547 31.155 0 0 3.717 3.821 10.529 5.67 33.078 8.98 140.803 35.139 276.08 36.034h0.972z"
          fill="#000000"
          p-id="5004"
        ></path>
        <path
          d="M860.28261 619.782c-8.12-26.086-19.204-56.506-30.427-85.72 0 0-6.456-0.795-9.718 0.148-100.71 29.205-222.773 47.818-315.792 46.695h-0.962C410.88561 582.017 289.65061 563.617 189.27961 534.698 185.44461 533.595 177.87261 534.063 177.87261 534.063 166.64961 563.276 155.56661 593.696 147.44761 619.782 108.72961 744.168 121.27261 795.644 130.82461 796.798c20.496 2.474 79.78-93.637 79.78-93.637 0 97.66 88.324 247.617 290.576 248.996a718.01 718.01 0 0 1 5.367 0C708.80161 950.778 797.12261 800.822 797.12261 703.162c0 0 59.284 96.111 79.783 93.637 9.55-1.154 22.093-52.63-16.623-177.017"
          fill="#000000"
          p-id="5005"
        ></path>
        <path
          d="M434.38261 316.917c-27.9 1.24-51.745-30.106-53.24-69.956-1.518-39.877 19.858-73.207 47.764-74.454 27.875-1.224 51.703 30.109 53.218 69.974 1.527 39.877-19.853 73.2-47.742 74.436m206.67-69.956c-1.494 39.85-25.34 71.194-53.24 69.956-27.888-1.238-49.269-34.559-47.742-74.435 1.513-39.868 25.341-71.201 53.216-69.974 27.909 1.247 49.285 34.576 47.767 74.453"
          fill="#FFFFFF"
          p-id="5006"
        ></path>
        <path
          d="M683.94261 368.627c-7.323-17.609-81.062-37.227-172.353-37.227h-0.98c-91.29 0-165.031 19.618-172.352 37.227a6.244 6.244 0 0 0-0.535 2.505c0 1.269 0.393 2.414 1.006 3.386 6.168 9.765 88.054 58.018 171.882 58.018h0.98c83.827 0 165.71-48.25 171.881-58.016a6.352 6.352 0 0 0 1.002-3.395c0-0.897-0.2-1.736-0.531-2.498"
          fill="#FAAD08"
          p-id="5007"
        ></path>
        <path
          d="M467.63161 256.377c1.26 15.886-7.377 30-19.266 31.542-11.907 1.544-22.569-10.083-23.836-25.978-1.243-15.895 7.381-30.008 19.25-31.538 11.927-1.549 22.607 10.088 23.852 25.974m73.097 7.935c2.533-4.118 19.827-25.77 55.62-17.886 9.401 2.07 13.75 5.116 14.668 6.316 1.355 1.77 1.726 4.29 0.352 7.684-2.722 6.725-8.338 6.542-11.454 5.226-2.01-0.85-26.94-15.889-49.905 6.553-1.579 1.545-4.405 2.074-7.085 0.242-2.678-1.834-3.786-5.553-2.196-8.135"
          fill="#000000"
          p-id="5008"
        ></path>
        <path
          d="M504.33261 584.495h-0.967c-63.568 0.752-140.646-7.504-215.286-21.92-6.391 36.262-10.25 81.838-6.936 136.196 8.37 137.384 91.62 223.736 220.118 224.996H506.48461c128.498-1.26 211.748-87.612 220.12-224.996 3.314-54.362-0.547-99.938-6.94-136.203-74.654 14.423-151.745 22.684-215.332 21.927"
          fill="#FFFFFF"
          p-id="5009"
        ></path>
        <path
          d="M323.27461 577.016v137.468s64.957 12.705 130.031 3.91V591.59c-41.225-2.262-85.688-7.304-130.031-14.574"
          fill="#EB1C26"
          p-id="5010"
        ></path>
        <path
          d="M788.09761 432.536s-121.98 40.387-283.743 41.539h-0.962c-161.497-1.147-283.328-41.401-283.744-41.539l-40.854 106.952c102.186 32.31 228.837 53.135 324.598 51.926l0.96-0.002c95.768 1.216 222.4-19.61 324.6-51.924l-40.855-106.952z"
          fill="#EB1C26"
          p-id="5011"
        ></path>
      </svg>
      <div class="hint">交流群:753963039</div>
    </div>
    <br />

    <div
      class="features"
      style="display: flex; align-items: center; justify-content: space-between"
    >
      <div class="icon" style="font-size: 2.5em">🔜</div>
      <div class="contents" style="margin: 0 auto">
        <div class="content">🪄 自定义外观</div>
        <div class="content">📸 集成截图和OCR功能</div>
        <div class="content">🤖 集成ChatGPT</div>
      </div>
    </div>
  </a-card>
  <!-- 个人联系方式 -->
  <a-card
    class="box-card"
    style="width: 400px; margin: 0 auto"
    :hoverable="true"
  >
    <template #title>
      <div class="card-header" style="text-align: center">
        <span>联系我</span>
      </div>
    </template>
    <div class="icons">
      <!-- github图标 svg -->
      <a
        href="https://github.com/AZCodingAccount"
        target="_blank"
        rel="noopener noreferrer"
      >
        <svg
          xmlns="http://www.w3.org/2000/svg"
          aria-hidden="true"
          role="img"
          width="3em"
          height="3em"
          viewBox="0 0 32 32"
          class="iconify iconify--carbon"
        >
          <path
            fill="currentColor"
            fill-rule="evenodd"
            d="M16 2a14 14 0 0 0-4.43 27.28c.7.13 1-.3 1-.67v-2.38c-3.89.84-4.71-1.88-4.71-1.88a3.71 3.71 0 0 0-1.62-2.05c-1.27-.86.1-.85.1-.85a2.94 2.94 0 0 1 2.14 1.45a3 3 0 0 0 4.08 1.16a2.93 2.93 0 0 1 .88-1.87c-3.1-.36-6.37-1.56-6.37-6.92a5.4 5.4 0 0 1 1.44-3.76a5 5 0 0 1 .14-3.7s1.17-.38 3.85 1.43a13.3 13.3 0 0 1 7 0c2.67-1.81 3.84-1.43 3.84-1.43a5 5 0 0 1 .14 3.7a5.4 5.4 0 0 1 1.44 3.76c0 5.38-3.27 6.56-6.39 6.91a3.33 3.33 0 0 1 .95 2.59v3.84c0 .46.25.81 1 .67A14 14 0 0 0 16 2Z"
          ></path></svg
      ></a>
      <!-- B站图标 -->
      <a
        href="https://space.bilibili.com/501122856"
        target="_blank"
        rel="noopener noreferrer"
        ><svg
          t="1706371676282"
          class="icon"
          viewBox="0 0 1117 1024"
          version="1.1"
          xmlns="http://www.w3.org/2000/svg"
          p-id="4329"
          width="3em"
          height="3em"
        >
          <path
            d="M222.859636 17.966545c-9.495273 8.936727-18.432 22.341818-20.666181 29.044364-3.909818 12.846545 13.963636 68.142545 22.341818 68.142546s32.395636 25.693091 32.395636 34.629818c0 17.873455-19.549091 28.485818-51.386182 28.485818-37.981091 0-113.943273 30.161455-140.194909 55.854545-10.053818 9.495273-28.485818 36.864-41.332363 61.44L0 339.688727v512.186182l23.458909 44.125091c26.810182 51.944727 39.098182 64.791273 90.484364 92.718545l44.683636 24.576h788.666182l44.683636-21.783272c56.413091-26.810182 79.313455-49.152 104.448-103.330909l19.549091-41.890909v-252.462546l0.558546-252.462545-19.549091-39.656728c-10.053818-22.341818-30.72-51.386182-46.359273-65.349818-34.071273-32.954182-94.394182-59.205818-133.492364-59.205818-59.205818 0-70.935273-24.576-29.044363-63.115636 22.341818-20.107636 25.134545-27.368727 25.134545-49.710546 0-21.783273-3.909818-30.72-18.432-45.800727-10.053818-10.053818-24.576-18.432-32.395636-18.432-12.846545 0-37.422545 10.053818-44.125091 18.432-1.675636 1.675636-39.098182 38.539636-82.664727 80.989091l-79.872 77.637818-91.042909-0.558545c-49.710545 0-96.069818-2.792727-102.213819-5.02691-6.144-2.792727-41.890909-34.071273-79.313454-70.935272C272.570182-7.168 256.372364-16.104727 222.859636 17.966545z m712.145455 286.533819c5.585455 0.558545 21.783273 10.053818 34.629818 22.341818l23.458909 21.783273 1.675637 236.823272c1.117091 215.04 0.558545 237.940364-9.495273 257.489455-15.639273 29.602909-37.981091 44.125091-71.493818 45.800727-15.639273 0.558545-189.346909 0.558545-385.396364 0l-355.793455-1.675636-49.152-49.152V355.886545l22.900364-24.576c17.314909-19.549091 27.927273-25.693091 45.800727-27.368727 17.873455-1.117091 692.596364-0.558545 742.865455 0.558546z"
            fill="#1296DB"
            p-id="4330"
          ></path>
          <path
            d="M304.407273 496.64c-22.341818 24.017455-22.900364 27.368727-22.900364 72.610909 0 43.566545 1.117091 48.593455 19.549091 69.818182 31.837091 36.305455 60.881455 35.188364 92.16-2.792727 12.288-13.963636 13.963636-24.017455 14.522182-69.818182 0-51.386182-0.558545-53.061818-21.783273-74.286546-29.602909-30.161455-51.944727-28.485818-81.547636 4.468364z m428.962909-3.909818c-20.666182 20.666182-21.783273 22.900364-21.783273 75.403636 0 51.944727 0.558545 54.178909 20.107636 73.169455 26.810182 25.693091 39.098182 29.044364 63.674182 15.080727 31.837091-18.432 43.566545-47.476364 40.215273-98.862545-2.792727-38.539636-5.026909-45.800727-24.017455-65.349819-27.368727-27.927273-49.710545-27.927273-78.196363 0.558546z"
            fill="#1296DB"
            p-id="4331"
          ></path>
        </svg>
      </a>

      <!-- 博客图标 svg -->
      <a
        href="https://blog.bugdesigner.cn"
        target="_blank"
        rel="noopener noreferrer"
      >
        <svg
          t="1703247825928"
          class="icon"
          viewBox="0 0 1024 1024"
          version="1.1"
          xmlns="http://www.w3.org/2000/svg"
          p-id="6086"
          width="3em"
          height="3em"
        >
          <path
            d="M1024 756.150857V267.849143A267.849143 267.849143 0 0 0 756.150857 0H267.849143A267.849143 267.849143 0 0 0 0 267.849143v488.301714A267.849143 267.849143 0 0 0 267.849143 1024h488.301714A267.849143 267.849143 0 0 0 1024 756.150857z"
            fill="#1ABC9C"
            p-id="6087"
          ></path>
          <path
            d="M950.857143 462.994286h-63.926857v14.299428c-11.666286-6.473143-22.418286-15.067429-34.450286-18.578285-51.309714-15.469714-102.656 18.578286-111.177143 74.166857-2.56 16.457143-2.56 34.084571-0.182857 50.505143 7.972571 56.576 48.164571 87.917714 101.339429 80.457142 16.859429-2.340571 31.305143-10.166857 44.288-23.881142 0.950857 18.395429 2.048 35.035429-7.789715 49.554285-12.214857 17.993143-31.085714 15.652571-48.896 16.054857V768c13.348571-0.768 25.965714-0.182857 38.363429-2.340571 37.595429-6.473143 65.755429-26.441143 76.873143-66.377143 4.059429-14.482286 5.193143-30.134857 5.376-45.202286 0.548571-60.306286 0.182857-120.612571 0.182857-180.882286v-10.203428z m-103.021714 144.274285c-23.515429 0-42.422857-19.968-42.422858-44.617142 0-24.868571 19.090286-44.617143 42.605715-44.434286 23.552 0.182857 42.24 20.333714 42.057143 45.019428-0.365714 24.283429-19.273143 44.032-42.24 44.032zM182.528 475.136l-7.424 5.668571v-108.836571H109.714286v288.365714h65.974857v-21.321143c11.300571 14.08 22.418286 24.246857 37.229714 27.209143 34.816 6.656 64.292571-5.705143 87.442286-32.512 28.342857-32.914286 30.939429-87.113143 8.338286-131.145143-25.965714-50.724571-83.382857-63.268571-126.171429-27.428571z m34.450286 132.132571c-23.332571 0-42.422857-20.114286-42.24-44.8 0-24.283429 18.724571-44.068571 41.874285-44.251428 23.734857-0.182857 42.605714 19.382857 42.605715 44.251428 0 24.649143-18.688 44.8-42.24 44.8zM669.988571 479.817143c-20.589714-16.822857-44.288-23.478857-70.034285-25.014857-10.020571 1.170286-20.187429 1.755429-30.208 3.693714-48.164571 9.216-78.006857 41.508571-84.114286 90.441143-6.290286 52.48 20.772571 98.852571 67.657143 113.737143 33.865143 10.605714 67.035429 6.656 99.108571-8.777143 71.68-34.852571 63.707429-136.265143 17.554286-174.08z m-76.324571 127.451428c-23.369143-0.182857-42.24-20.150857-42.057143-44.982857 0.182857-24.32 18.870857-44.068571 42.057143-44.068571 23.332571-0.182857 42.605714 19.748571 42.605714 44.434286 0.182857 24.283429-19.273143 44.617143-42.605714 44.617142zM426.898286 417.389714c-13.531429-34.852571-46.299429-54.601143-81.517715-51.492571 0 20.589714-0.182857 41.325714 0.182858 62.061714 0 1.572571 2.779429 3.913143 4.827428 4.717714 9.069714 3.510857 15.945143 9.764571 18.322286 19.382858 3.364571 13.494857 6.326857 27.428571 6.509714 41.106285 0.731429 51.858286 0.365714 103.533714 0.365714 155.428572v11.922285h62.976c0.182857-2.742857 0.365714-4.498286 0.365715-6.436571 0-61.659429 0.731429-123.136-0.548572-184.795429-0.548571-17.444571-5.193143-35.657143-11.483428-51.894857z"
            fill="#FFFFFF"
            p-id="6088"
          ></path></svg
      ></a>

      <!-- 邮箱图标 svg  -->
      <a
        href="mailto:han892577@qq.com"
        target="_blank"
        rel="noopener noreferrer"
      >
        <svg
          t="1703322434153"
          class="icon"
          viewBox="0 0 1024 1024"
          version="1.1"
          xmlns="http://www.w3.org/2000/svg"
          p-id="7019"
          width="3em"
          height="3em"
        >
          <path
            d="M838.954667 234.666667H170.666667c-3.626667 0-7.168 0.448-10.56 1.322666l323.690666 323.669334a21.333333 21.333333 0 0 0 30.165334 0L838.954667 234.666667z m46.144 14.186666l-260.693334 260.693334 262.933334 262.912c5.44-7.168 8.661333-16.106667 8.661333-25.792V277.333333c0-10.944-4.117333-20.906667-10.88-28.48zM843.861333 789.333333l-249.6-249.621333-50.133333 50.133333a64 64 0 0 1-90.517333 0l-50.112-50.133333L156.373333 786.88c4.48 1.578667 9.28 2.453333 14.314667 2.453333h673.194667zM128.661333 754.218667L373.333333 509.525333 129.578667 265.813333A42.709333 42.709333 0 0 0 128 277.333333v469.333334c0 2.56 0.213333 5.098667 0.661333 7.552zM170.666667 192h682.666666a85.333333 85.333333 0 0 1 85.333334 85.333333v469.333334a85.333333 85.333333 0 0 1-85.333334 85.333333H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333333V277.333333a85.333333 85.333333 0 0 1 85.333334-85.333333z"
            fill="#1296db"
            p-id="7020"
          ></path></svg
      ></a>

      <!-- gitee图标svg -->
      <a
        href="https://gitee.com/Albert_han"
        target="_blank"
        rel="noopener noreferrer"
      >
        <svg
          t="1703322543422"
          class="icon"
          viewBox="0 0 1024 1024"
          version="1.1"
          xmlns="http://www.w3.org/2000/svg"
          p-id="8999"
          width="3em"
          height="3em"
        >
          <path
            d="M512 1024C229.222 1024 0 794.778 0 512S229.222 0 512 0s512 229.222 512 512-229.222 512-512 512z m259.149-568.883h-290.74a25.293 25.293 0 0 0-25.292 25.293l-0.026 63.206c0 13.952 11.315 25.293 25.267 25.293h177.024c13.978 0 25.293 11.315 25.293 25.267v12.646a75.853 75.853 0 0 1-75.853 75.853h-240.23a25.293 25.293 0 0 1-25.267-25.293V417.203a75.853 75.853 0 0 1 75.827-75.853h353.946a25.293 25.293 0 0 0 25.267-25.292l0.077-63.207a25.293 25.293 0 0 0-25.268-25.293H417.152a189.62 189.62 0 0 0-189.62 189.645V771.15c0 13.977 11.316 25.293 25.294 25.293h372.94a170.65 170.65 0 0 0 170.65-170.65V480.384a25.293 25.293 0 0 0-25.293-25.267z"
            fill="#C71D23"
            p-id="9000"
          ></path></svg
      ></a>
    </div>
  </a-card>
</template>

<style scoped>
/* 个人介绍布局 */
.icons {
  display: flex;
  align-items: center; /* 垂直居中 */
  justify-content: center;
}
/* 个人介绍的图标设置 */
.icons svg {
  margin: 0px 15px;
}
/* 使用说明书hover效果 */
.docs:hover {
  color: rgb(252, 106, 0);
}
</style>
